<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <style>
    * {
      margin: 0;
      padding: 0;
    }
    ul {
      list-style: none;
    }
    a {
      text-decoration: none;
    }
    /* 头部样式 */
    /*#region*/
    header {
      border-bottom: 1px solid rgba(204, 204, 204, 0.411);
      background-color: rgba(238, 238, 238, 0.37);
    }

    .header {
      display: flex;
      justify-content: space-between;
      width: 1200px;
      height: 39px;
      line-height: 39px;
      box-sizing: border-box;
      margin: 0 auto;
      font-size: 12px;
    }

    .header .left {
      display: flex;
      align-items: center;
    }

    .header .right ul {

      display: flex;
      font-size: 12px;
    }

    .register {
      background-color: #2769dc;
      margin-left: 5px;
      padding: 4px 10px;
      font-size: 12px;
      color: white;
      border-radius: 2px;
      height: 24px;
      border: 0;
    }
    .register:hover{
      font-weight: 700;
    }
    .login {
      display: block;
      width: 80px;
      text-align: center;
      height: 14px;
      line-height: 14px;
      border-right: 1px solid #ccc;
      color: rgba(4, 4, 253, 0.671);
      cursor: pointer;
    }

    .login:hover {
      font-weight: 600;
    }

    .header .right ul li {
      position: relative;
      width: 80px;
      height: 39px;
      box-sizing: border-box;
      padding: 0 16px;
      cursor: pointer;
    }

    .header .right ul li::after {
      content: '';
      position: absolute;
      width: 1px;
      height: 14px;
      background-color: rgba(204, 204, 204, 0.603);
      top: 14px;
      right: 0;
    }

    .header .right ul li:hover {
      background-color: #fff;
      color: blue;
    }
    .header .right ul li:hover div{
      display: block;
    }
    .header .right ul li div{
      display: none;
      position: absolute;
      z-index: 100;
      top: 39px;
      left: 0;
      width: 100px;
      height: 200px;
      color: black;
      box-sizing: border-box;
      background-color: #fff;
      border: 1px solid #ccc;
      border-top: 0;
    }
/*#endregion*/
    
  /* 搜索区域样式 */
    /*#region*/
    .mainsearch{
      width: 1200px;
      height: 151px;
      box-sizing: border-box;
      padding: 36px 0 40px 0;
      margin: 0 auto;
    }
    .logo img{
      width: 160px;
      height: 45px;
    }
    .mainlogo{
      display: flex;
    }
    .tree{
      position: relative;
      width: 39px;
      height: 42px;
      margin-left:10px ;
    }
    .treeimg{
      position: relative;
      z-index: 1;
      width: 39px;
      height: 42px;
    }
    .sun{
      position:absolute;
      z-index: 0;
      top: 0;
      left: 0;
      width: 14px;
      height: 14px;
      animation: sunmove 2s linear infinite alternate;
      z-index: 0;
    }
    @keyframes sunmove{
      from{
        transform: translate(0) rotate(0);
      }
      to{
        transform: translate(15px,15px) rotate(360deg);
      }
    }
    .mainsearch{
      display: flex;
      position: relative;
      border-bottom: 1px solid blue;
    }
    .searchcontent{
      display: flex;
      position: relative;
      margin-left: 100px;
    }
    .searchtype,.search{
      box-sizing: border-box;
      height: 40px;
      line-height: 36px;
      border: 2px solid rgba(0, 0, 255, 0.671);
      background-color: #fff;
    }
    .searchtype{
      width: 90px;
      font-size: 14px;
      line-height: 34px;
      padding-left: 14px;
      border-right: 0;
    }
    .search{
      width: 388px;
      box-sizing: border-box;
      border-left: 1px solid rgba(204, 204, 204, 0.397);
      padding: 0 136px 0 18px;
      outline: none;
    }
    .key{
      position: absolute;
      top: 7px;
      left: 360px;
    }
    .key a{
      font-size: 12px;
      padding: 5px 10px;
      color: black;
      background-color: #F1F4F7;
    }
    .key a:hover{
      color: rgba(0, 0, 255, 0.568);
      font-weight: 700;
    }
    .searchbtn{
      width: 120px;
      height: 40px;
      color: white;
      border: 0;
      background-color: rgba(0, 0, 255, 0.671);
    }
    .searchbtn:hover{
      background-color: rgba(0, 0, 255, 0.849);
    }
    .fabu1,.fabu2{
      height: 40px;
      font-size: 14px;
      line-height: 40px;
      text-align: center;
      box-sizing: border-box;
      border: 1px solid #ccc;
      margin-left: 46px;
    }
    .fabu1{
      width: 146px;
      padding: 0 16px 0 44px;
      background-color: #f1f4f7;
    }
    .fabu2{
      margin-left: 10px;
      color: black;
      width: 90px;
      padding: 0 16px;
    }
    .fabu1:hover,.fabu2:hover{
      background-color: #f1f4f7;
      font-weight: 700;
      color: blue;
    }
    .mainsearch .list{
      position: absolute;
      width: auto;
      height: 40px;
      line-height: 40px;
      font-size: 16px;
      display: flex;
      bottom: 0;
      right: 0;
      width: 980px;
    }
    .mainsearch .list li{
      padding: 0 23px;
      font-weight: 600;
      cursor: pointer;
    }
    .mainsearch .list li:first-child{
      color: rgba(0, 0, 255, 0.651);
      
    }
    .mainsearch .list li:nth-child(4)::before{
      content: '';
      background-image: url(images/hot.png);
      background-repeat: no-repeat;
      width: 32px;
      height: 20px;
      position: absolute;
      top: 0;
      right: -10px;
      animation: hotmove .5s linear infinite alternate;
    }
    @keyframes hotmove{
      to{
        transform: translateY(5px);
      }
    }
    .mainsearch .list li:nth-child(4){
      position: relative;
    }
    .mainsearch .list li:nth-child(6){
      position: relative;
      padding-right: 50px;
    }
    .mainsearch .list li:nth-child(6)::after{
      content: '';
      width: 1px;
      height: 20px;
      position: absolute;
      background-color: #ccc;
      top: 10px;
      right: 0;
    }
    .mainsearch .list li:nth-child(6)::before{
      content: '';
      position: absolute;
      width: 62px;
      height: 19px;
      top: -10px;
      right: 0px;
      background-image: url(images/zhenghao.png);
    }
    .mainsearch .list li:hover{
      color: rgba(0, 0, 255, 0.651);
    }
    /* #endregion */
    
    /* 主题区（轮播图） */
    /* 主题区左边 */
    /*#region*/
    .mainbody{
      display: flex;
      width: 1200px;
      height: 490px;
      /* background-color: #ccc; */
      margin: 0 auto;
      border: 1px solid #ccc;
      border-top: 0;
    }
    .mainbody .left{
      background-color: #fff;
      width: 200px;
      height: 490px;
    }
    .mainbody .left ul{
      position: relative;
      width: 200px;
      height: 336px;
      padding: 12px 0;
    }
    .mainbody .left ul li{
      width: 200px;
      height: 56px;
      padding: 6px 0 6px 12px;
      box-sizing: border-box;
    }
    .mainbody .left .a1{
      font-size: 15px;
      color: black;
      font-weight: 700;
    }
    .gyinfo a{
      font-size: 12px;
      color: black;
    }
    .mainbody .left ul li:hover{
      background-color: #E8EDF2;
      border-left: 2px solid blue;
    }
    .mainbody .left ul li .a1:hover,.mainbody .left ul li .gyinfo a:hover{
      color: blue;
    }
    .xxinfo{
      width: 790px;
      height: 490px;
      background-color: #eee;
      box-shadow: 0 4px 10px -4px rgb(38 38 38 / 20%);
      position: absolute;
      left: 200px;
      top: 0;
      z-index: 200;
      display: none;
    }
    .mainbody .left ul li:hover .xxinfo{
      display: block;
    }
    h5{
      font-size: 16px;
      margin: 20px 0 16px 0;
      padding-left: 16px;
    }
    h5 a{
      color: black;
    }
    .leftbottom{
      display: flex;
      flex-wrap: wrap;
      width: 184px;
      height: 73px;
      padding-left: 16px;
    }
    .leftbottom a{
      display: block;
      font-size: 12px;
      color: black;
      width: 33.3%;
    }
    .leftbottom a:hover{
      color: blue;
      font-weight: 700;
    }
    /*#endregion*/
    
    /* 主题区中间轮播图 */
    /*#region*/
    .swiper,.swiperimg,.swiperimg img{
      width: 800px;
      height: 490px;
    }
    .swiper{
      position: relative;
    }
    /* .swiper .swiperimg{
      position: relative;
    } */
    .swiperimg{
      position: absolute;
      top: 0;
      left: 0;
      background-image: url(images/swiper1.jpg);
      animation: swiperchange 10s linear infinite;
    }
    .swipercontent div img,.swipercontent div{
      width: 194px;
      height: 140px;
      display: block;
      box-sizing: border-box;
    }
    .swipercontent div img{
      width: 193px;
    }
    .swipercontent div{
      border-right: 1px solid #ccc;
    }
    .swipercontent div:last-child{
      border-right: 0;
    }
    .swipercontent{
      display: flex;
      position: absolute;
      bottom: 0;
      left: 12px;
      font-size: 0;
    }
    .circle{
      display: flex;
      position: absolute;
      left: 45%;
      bottom: 150px;
    }
    .circle li {
      width: 10px;
      height: 10px;
      border-radius: 50%;
      margin-left: 10px;
      border: 1px solid #fff;
      cursor: pointer;
    }
    .circle li:first-child{
      background-color: #fff;
    }
    .circle li:hover {
      background-color: #fff;
    }
    @keyframes swiperchange{
      0%,20%{
        background-image: url(images/swiper1.jpg);
      }
      35%,55%{
        background-image: url(images/swiper2.png);
      }
      70%,85%{
        background-image: url(images/swiper3.jpg);
      }
    }
    /*#endregion*/
    
    /* 主题区右边部分 */
    /*#region*/
    .mainbody .swiperright{
      width: 200px;
      height: 490px;
      /* background-color: #ccc; */
    }
    .righttop{
      width: 200px;
      height: 160px;
    }
    .userinfo{
      position: relative;
      padding-left: 68px;
      height: 72px;
    }
    .touxiang,.touxiang img{
      width: 42px;
      height: 42px;
    }
    .touxiang{
      position: absolute;
      left: 10px;
      top: 20px;
    }
    .userinfo .p2{
      padding-top: 20px;
      font-size: 14px;
      line-height: 20px;
    }
    .userinfo .p1{
      font-size: 12px;
      line-height: 17px;
    }
    .righttop .login1,.righttop .register1{
      display: block;
      width: 160px;
      height: 30px;
      margin: 0 20px 8px;
      text-align: center;
      line-height: 30px;
      border: 1px solid #1E60D3;
    }
    .righttop .login1{
      color: white;
      background-color: #1E60D3;
    }
    .righttop .register1{
      color: #1E60D3;
    }
    .righttop .login1:hover,.righttop .register1:hover{
      font-weight: 700;
    }

    .rightmiddle{
      display: flex;
      flex-wrap: wrap;
      width: 186px;
      height: 155px;
      padding: 4px 7px 0;
    }
    .rightmiddle a{
      width: 48px;
      height: 51px;
      margin: 16px 7px 0;
    }
    .navicon{
      width: 32px;
      height: 32px;
      margin: 0 8px;
      background-image: linear-gradient(to bottom,#4667CD 60%,#6BBEFF);
    }
    .rightmiddle  p{
      font-size: 12px;
      color: #595959;
      margin-top: 2px;
      text-align: center;
    }
    .rightmiddle  p:hover{
      color: blue;
      font-weight: 700;
    }
    .rightbottom {
      /* background-color: skyblue; */
      width: 160px;
      height: 170px;   
      padding: 0 20px;
    }
    .buymessage{
      display: flex;
      font-size: 14px;
      width: 160px;
      height: 18px;
      padding: 16px 0 8px 0;
      font-weight: 700;
    }
    .buymessage div:nth-child(1){
      color: blue;
    }
    .buymessage span{
      padding: 0 12px;
    }
    .messagelist li {
      width: 160px;
      height: 24px;
      line-height: 24px;
      font-size: 12px;
      color: black;
      cursor: pointer;
    }
    .messagelist li:hover{
      color: blue;
    }
    /*#endregion*/
 
    /* 品牌宣传区 */
    /*#region*/
    .recommand{
      padding-top: 77px;
      height: 441px;
      background-image: linear-gradient(to bottom,#FAFBFC 70%,#DDE4EB);
    }
    .recommand .big{
      position: relative;
      width: 1200px;
      margin: 0 auto;
      height: 441px;
      background: url(images/bgimg.png) no-repeat 0 0 #252E4D;
      /* background-size: 1200px 441px; */
    }
    .bigcontent{
      width: 1140px;
      height: 390px;
      padding: 0 30px;
    }
    .bigcontenttop{
      display: flex;
      height: 150px;
      justify-content: space-between;
    }
    .bigcontenttop .text{
      color: white;
      width: 226px;
      height: 117px;
      font-size: 13px;
      padding-top: 25px;
    }
    .bigcontenttop .text h3{
      font-size: 24px;
    }
    .bigcontenttop .text span{
      display: block;
      width: 70px;
      height: 2px;
      background-color: orange;
      margin: 10px 0;
    }
    .brandlist{
      display: flex;
      width: 835px;
      height: 118px;
      margin-top: 30px;
      border: 1px solid orange;
      background-color: rgba(232,123,43,.2);
    }
    .brandlist .itemlist{
      width: 160px;
      height: 63px;
      padding: 0 24px;
      margin-top: 29px;
      border-right: 1px solid orange;
    }
    .itemlist h5{
      position: relative;
      width: 130px;
      font-size: 15px;
      height: 21px;
      padding-left: 30px;
      color: #E87B2B;
    }
    .itemlist h5 i{
      position: absolute;
      left: 0;
      top: 0;
    }
    .itemlist p{
      font-size: 12px;
      color: white;
    }

    /* 公司列表 */
    .company{
      display: flex;
      width: 1140px;
      height: 257px;
      margin-top: 60px;
    }
    .company li{
      width: 228px;
      height: 257px;
      margin-right: 5px;
      background-color: #fff;
      border: 1px solid #ccc;
    }
    .companyitem .companyimg{
      display: block;
      width: 180px;
      height: 120px;
      text-align: center;
      margin: 20px;
      margin-bottom: 0;
      padding-bottom: 20px;
      border-bottom: 1px solid #ccc;
    }
    .companyitem a div{
      width: 180px;
      height: 120px;
      position: relative;
    }
    .companyitem .companyimg div img{
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%,-50%);
    }
    .bottomtext{
      width: 188px;
      height: 61px;
      padding: 20px 16px 0;
      font-size: 12px;
    }
    .bottomtext h6{
      font-size: 13px;
      font-weight: 700;
      margin-top: 15px;
    }
    .bottomtext p{
      color: #999;
      margin-top: 10px;
    }
    .companyimg2{
      width: 154px;
      height: 120px;
    }
    .recommand .join{
      position: absolute;
      width: 30px;
      height: 139px;
      top: 0;
      left: -30px;
      background: url(images/join.png);
    }
    .recommand .join img{
      width: 16px;
      height: 16px;
      position: absolute;
      bottom: 20px;
      left: 4px;
      animation: jiantoumove .3s linear infinite alternate;
    }
    @keyframes jiantoumove{
      to{
        transform: translateX(4px);
      }
    }
    /*#endregion*/
    
    /* 行业厂家推荐 */
    /*#region*/
    .hangye{
      box-sizing: border-box;
      padding-top: 40px;
      height: 516px;
    }
    .hangyecontent{
      width: 1200px;
      margin: 0 auto;
    }
    .hangyecontent h3{
      padding:55px 0 50px 0;
      text-align: center;
    }
    .hangyecontent ul{
      display: flex;
      flex-wrap: wrap;
    }
    .hangyecontent ul li{
      width: 300px;
      height: 120px;
      padding-bottom: 54px;
    }
    .changjiap{
      text-align: center;
      margin-bottom: 19px;
    }
    .changjiaa{
      display: block;
      text-align: center;
      line-height: 38px;
      width: 218px;
      height: 38px;
      font-size: 14px;
      color: blue;
      border: 1px solid blue;
      margin: 0 auto 14px;
    }
    .changjiaa:hover{
      background-color: blue;
      color: #fff;
    }
    .changjiap1 span{
      font-size: 12px;
    }
    .changjiap1{
      font-size: 12px;
      text-align: center;
    }
    /*#endregion*/
    
    /* 品牌推荐 */
    /*#region */
    .brandrecommand{
      height: 362px;
      margin-bottom: 78px;
      background-color: #060c40;
      background-image: linear-gradient(to bottom,#15265a,#070d41);
      color: #fff;
    }
    .brandrecommandcontent{
      width: 1212px;
      height: 314px;
      margin: 0 auto;
      background: url(images/ppbg.png) no-repeat center 0;
    }
    .inner{
      height: 256px;
      padding-top: 58px;
    }
    .brandrecommandcontent h3{
      text-align: center;
      margin-bottom: 45px;
    }
    .brandrecommandlist{
      height: 184px;
      display: flex;
      flex-wrap: wrap;
    }
    .brandrecommandlist li{
      width: 122px;
      height: 44px;
      padding: 18px 34px;
      margin: 0 12px 12px 0;
      background-color: #fff;
    }
    .brandrecommandlist li a{
      display: block;
      width: 122px;
      height: 44px;
      text-align: center;
    }
    .brandrecommandlist li a img{
      height: 44px;
    }
    /*#endregion*/
    
    /* 楼层布局 */
    /*#region*/
    .floor{
      width: 100%;
      height: 550px;
      margin-bottom: 30px;
    }
    .floorlayout{
      display: flex;
      width: 1200px;
      height: 551px;
      margin: 0 auto;
      /* background-color: #ccc; */
      border: 1px solid #ccc;
    }
    .flooraside{
      width: 300px;
      height: 550px;
      background-color: #b0c2ce;
      background-image: linear-gradient(to bottom,#d0d6db,#b0c2ce);
    }
    .flooraside h3{
      padding-top:47px ;
      margin-bottom: 6px;
      font-size: 28px;
      line-height: 40px;
      text-align: center;
    }
    .flooraside p{
      padding-bottom: 65px;
      font-size: 14px;
      height: 20px;
      line-height: 20px;
      text-align: center;
      opacity: .4;
    }
    .floorasideimg{
      position: relative;
      width: 240px;
      height: 370px;
      padding: 0 30px;
    }
    .floorasideimg .img,.floorasideimg .img img{
      position: relative;
      width: 240px;
      height: 260px;
      background-color: #fff;
      text-align: center;
    }
    .floorasideimg .img img{
      width: 200px;
      height: 205px;
    }
    .floorasideimg .floortext{
      width: 136px;
      height: 32px;
      line-height: 32px;
      text-align: center;
      border-radius: 16px;
      background: #415f73;
      position: absolute;
      bottom: -16px;
      left: 52px;
    }
    .floorproduct{
      width: 657px;
      background-color: #fff;
      height: 551px;
    }
    .floorright{
      width: 243px;
      background-color: #fff;
      height: 551px;
    }
    .floorcircle{
      display: flex;
      position: absolute;
      bottom: 50px;
      left: 50%;
      transform: translateX(-50%);
    }
    .floorcircle li{
      width: 4px;
      height: 4px;
      border-radius: 2px;
      border: 1px solid #aaa;
      margin: 0 7px;
    }
    .floorcircle li:hover{
      background-color: #fff;
    }

    .producttop{
      position: relative;
      display: flex;
      width: 626px;
      height: 21px;
      padding: 19px 0 19px 30px ;
      border-right: 1px solid #ccc;
    }
    .producttop li{
      font-size: 15px;
      padding: 0 14px;
      border-right: 1px solid #ccc;
    }
    .producttop li:hover{
      cursor: pointer;
      font-weight: 700;
      color: black;
    }
    .producttop .more{
      position: absolute;
      right: 20px;
      top: 17px;
    }
    .productlist{
      display: flex;
      flex-wrap: wrap;
      width: 657px;
      height: 492px;
    }
    .productlist .item{
      text-align: center;
      width: 130px;
      height: 225px;
      padding: 20px 44px 0;
      border-top: 1px solid #ccc;
      border-right: 1px solid #ccc;
    }
    .productlist .item img{
      width: 130px;
      height: 130px;
    }
    .productlist .item p{
      margin: 16px 0;
      font-size: 12px;
    }
    .productlist .item span{
      font-size: 14px;
      color: red;
    }
    .floorright .righttop{
      width: 219px;
      height: 59px;
      padding-left: 24px;
      line-height: 59px;
      font-size: 16px;
      font-weight: 600;
      background: #f1f4f7;
    }
    .companyitem1{
      font-size: 14px;
      width: 199px;
      height: 63px;
      padding: 18px 21px 0 23px;
      border-top: 1px solid #ccc;
    }
    .companyitem1 p{
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .companyitem1 p:first-child{
      margin-bottom: 8px;
    }
    .companyitem1 p:last-child{
      font-size: 12px;
      color: #999;
    }
    .companyitem1 p:first-child:hover{
      font-weight: 700;
      cursor: pointer;
      color: black;
    }
    .productlist .item p:hover{
      font-weight: 700; 
      color: blue;
      cursor: pointer;
    }
    .banner,.banner img{
      width: 1200px;
      height: 90px;
      margin: 0 auto 20px;
    }
    /*#endregion*/

    /* 底部的广告 */
    .fixbanner{
      position:fixed;
      bottom: 0;
      left: 0 ;
      width: 100%;
      height: 160px;
    }
    .fixbanner img{
      height: 160px;
    }
</style>
</head>

<body>
  <!-- 头部区域 -->
  <header>
    <div class="header">
      <div class="left">
        <div class="welcome">
          欢迎来到世界工厂网!
        </div>
        <span class="login">登陆</span>
        <input type="button" class="register" value="免费注册">
      </div>
      <div class="right">
        <ul>
          <li>我的工厂<div>我的工厂</div></li>
          <li>会员服务<div>会员服务</div></li>
          <li>客服中心<div>客服中心</div></li>
          <li>网站地图<div>网站地图</div></li>
          <li>移动端<div>移动端</div></li>
        </ul>
      </div>
    </div>
  </header>

  <!-- 搜索区域 -->
  <div class="mainsearch">
    <!-- 左边logo -->
    <div class="mainlogo">
      <div class="logo">
        <img src="images/logo.png" alt="">
      </div>
      <div class="tree">
        <img class="treeimg" src="images/tree.png" alt="">
        <img class="sun" src="images/sun.png" alt="">
      </div>
    </div>
    <!-- 中间搜索框 -->
    <div class="searchcontent">
      <div class="searchtype">
        产品
      </div>
      <input class="search" type="input" placeholder="输入关键字搜索">
      <div class="key">
        <a href="">破碎机</a>
        <a href="">锅炉</a>
      </div>
      <input class="searchbtn" type="button" value="搜索">
    </div>
    <!-- 右边发布按钮 -->
    <a class="fabu1" href="#">免费发布采购</a>
    <a class="fabu2" href="#">发布产品</a>
    <ul class="list">
      <li>首页</li>
      <li>产品</li>
      <li>实力厂家</li>
      <li>采购</li>
      <li>行业微信群</li>
      <li>正好友</li>
      <li>会员服务</li>
      <li>增值服务</li>
    </ul>
  </div>

  <!-- 主题区（轮播图） -->
  <main>
    <div class="mainbody">
      <div class="left">
        <ul>
          <li>
            <a href="#" class="a1">工业品</a>
            <div class="gyinfo">
              <a href="#">机械及行业设备</a>
              <a href="#">仪器仪表</a>
            </div>
            <div class="xxinfo">
              工业品
            </div>
          </li>
          <li>
            <a href="#" class="a1">原拆料</a>
            <div class="gyinfo">
              <a href="#">机械及行业设备</a>
              <a href="#">仪器仪表</a>
            </div>
            <div class="xxinfo">
              原拆料
            </div>
          </li>
          <li>
            <a href="#" class="a1">消费品</a>
            <div class="gyinfo">
              <a href="#">机械及行业设备</a>
              <a href="#">仪器仪表</a>
            </div>
            <div class="xxinfo">
              消费品
            </div>
          </li>
          <li>
            <a href="#" class="a1">农业畜牧</a>
            <div class="gyinfo">
              <a href="#">机械及行业设备</a>
              <a href="#">仪器仪表</a>
            </div>
            <div class="xxinfo">
              农业畜牧
            </div>
          </li>
          <li>
            <a href="#" class="a1">宠物园艺</a>
            <div class="gyinfo">
              <a href="#">机械及行业设备</a>
              <a href="#">仪器仪表</a>
            </div>
            <div class="xxinfo">
              宠物园艺
            </div>
          </li>
          <li>
            <a href="#" class="a1">商务服务</a>
            <div class="gyinfo">
              <a href="#">机械及行业设备</a>
              <a href="#">仪器仪表</a>
            </div>
            <div class="xxinfo">
              商务服务
            </div>
          </li>
        </ul>
        <h5>
          <span>图</span>
          <a href="#">行业优质货源</a>
        </h5>
        <div class="leftbottom">
          <a href="#">工业品</a>
          <a href="#">工业品</a>
          <a href="#">工业品</a>
          <a href="#">工业品</a>
          <a href="#">工业品</a>
          <a href="#">工业品</a>
        </div>
      </div>
      <div class="swiper">
        <!-- 轮播图 -->
        <div class="swiperimg"></div>
        <!-- 轮播图下面的小圆圈 -->
        <ul class="circle">
          <li></li>
          <li></li>
          <li></li>
        </ul>
        <!-- 轮播图下面的图片列表 -->
        <div class="swipercontent">
          <div><img src="images/swipercontent1.jpg" alt=""></div>
          <div><img src="images/swipercontent2.jpg" alt=""></div>
          <div><img src="images/swipercontent3.jpg" alt=""></div>
          <div><img class="imgnone" src="images/swipercontent4.jpg" alt=""></div>
        </div>
      </div>
      <div class="swiperright">
        <div class="righttop">
          <div class="userinfo">
            <div class="touxiang">
              <img src="images/touxiang.png" alt="">
            </div>
            <p class="p2">嗨！你好</p>
            <p class="p1">欢迎来到工厂网!</p>
          </div>
          <a class="login1" href="">一键登录</a>
          <a class="register1" href="">免费注册</a>
        </div>
        <div class="rightmiddle">
          <a href="#">
            <div class="navicon">

            </div>
            <p>发布产品</p>
          </a>
          <a href="#">
            <div class="navicon">

            </div>
            <p>移动货源</p>
          </a>
          <a href="#">
            <div class="navicon">

            </div>
            <p>会员权益</p>
          </a>
          <a href="#">
            <div class="navicon">

            </div>
            <p>广告服务</p>
          </a>
          <a href="#">
            <div class="navicon">

            </div>
            <p>赚积分</p>
          </a>
          <a href="#">
            <div class="navicon">

            </div>
            <p>建站工具</p>
          </a>
        </div>
        <div class="rightbottom">
          <div class="buymessage">
            <div>采购动态</div>
            <span>|</span>
            <div>最新产品</div>
          </div>
          <!-- 消息列表 -->
          <ul class="messagelist">
            <li>求购：需要1万米进口弹力绳</li>
            <li>求购：需要1万米进口弹力绳</li>
            <li>求购：需要1万米进口弹力绳</li>
            <li>求购：需要1万米进口弹力绳</li>
            <li>求购：需要1万米进口弹力绳</li>
          </ul>
        </div>
      </div>
    </div>
  </main>

  <!-- 品牌宣传区 -->
  <div class="recommand">  
    <div class="big">
      <div class="bigcontent">
        <div class="bigcontenttop">
          <!-- 文字区域 -->
          <div class="text">
            <h3>线上总部建设<br>助力企业赢在起点</h3>
            <span></span>
            <p>传统制造企业从“官网升级”到“线上总部”的更优选择</p>
          </div>
          <ul class="brandlist">
            <li>
              <div class="itemlist">
                <h5>企业品牌宣传<i>图</i></h5>
                <p>更好的品牌营销方式，重新定义企业官网</p>
              </div>
            </li>
            <li>
              <div class="itemlist">
                <h5>企业品牌宣传<i>图</i></h5>
                <p>更好的品牌营销方式，重新定义企业官网</p>
              </div>
            </li>
            <li>
              <div class="itemlist">
                <h5>企业品牌宣传<i>图</i></h5>
                <p>更好的品牌营销方式，重新定义企业官网</p>
              </div>
            </li>
            <li>
              <div class="itemlist">
                <h5>企业品牌宣传<i>图</i></h5>
                <p>更好的品牌营销方式，重新定义企业官网</p>
              </div>
            </li>
          </ul>
        </div>
        <!-- 公司列表 -->
        <ul class="company">
          <li>
            <div class="companyitem">
              <a href="#" class="companyimg">
                <div><img src="images/company1.png" alt=""></div>
              </a>
              <div class="bottomtext">
                <h6>郑州市金辉源机械制造有限公司</h6>
                <p>了解更多企业详情，<a href="#" class="more">点击获取</a></p>
              </div>
            </div>
          </li>
          <li>
            <div class="companyitem">
              <a href="#" class="companyimg">
                <div><img class="companyimg2" src="images/company2.png" alt=""></div>
              </a>
              <div class="bottomtext">
                <h6>郑州市金辉源机械制造有限公司</h6>
                <p>了解更多企业详情，<a href="#" class="more">点击获取</a></p>
              </div>
            </div>
          </li>
          <li>
            <div class="companyitem">
              <a href="#" class="companyimg">
                <div><img src="images/company3.png" alt=""></div>
              </a>
              <div class="bottomtext">
                <h6>郑州市金辉源机械制造有限公司</h6>
                <p>了解更多企业详情，<a href="#" class="more">点击获取</a></p>
              </div>
            </div>
          </li>
          <li>
            <div class="companyitem">
              <a href="#" class="companyimg">
                <div><img src="images/company4.png" alt=""></div>
              </a>
              <div class="bottomtext">
                <h6>郑州市金辉源机械制造有限公司</h6>
                <p>了解更多企业详情，<a href="#" class="more">点击获取</a></p>
              </div>
            </div>
          </li>
          <li>
            <div class="companyitem">
              <a href="#" class="companyimg">
                <div><img src="images/company5.png" alt=""></div>
              </a>
              <div class="bottomtext">
                <h6>郑州市金辉源机械制造有限公司</h6>
                <p>了解更多企业详情，<a href="#" class="more">点击获取</a></p>
              </div>
            </div>
          </li>
        </ul>
      </div>
      <a href="#" class="join">
        <img src="images/jiantou.png" alt="">
      </a>
    </div>
  </div>

  <!-- 行业厂家推荐 -->
  <div class="hangye">
    <div class="hangyecontent">
      <h3>行业厂家推荐</h3>
      <ul>
        <li>
          <p class="changjiap">机床厂家推荐</p>
          <a class="changjiaa" href="#">东莞市巨人机械有限公司</a>
          <p class="changjiap1"><span>主营：</span>精雕机,钻攻机,加工中心</p>
        </li>
        <li>
          <p class="changjiap">机床厂家推荐</p>
          <a class="changjiaa" href="#">东莞市巨人机械有限公司</a>
          <p class="changjiap1"><span>主营：</span>精雕机,钻攻机,加工中心</p>
        </li>
        <li>
          <p class="changjiap">机床厂家推荐</p>
          <a class="changjiaa" href="#">东莞市巨人机械有限公司</a>
          <p class="changjiap1"><span>主营：</span>精雕机,钻攻机,加工中心</p>
        </li>
        <li>
          <p class="changjiap">机床厂家推荐</p>
          <a class="changjiaa" href="#">东莞市巨人机械有限公司</a>
          <p class="changjiap1"><span>主营：</span>精雕机,钻攻机,加工中心</p>
        </li>
        <li>
          <p class="changjiap">机床厂家推荐</p>
          <a class="changjiaa" href="#">东莞市巨人机械有限公司</a>
          <p class="changjiap1"><span>主营：</span>精雕机,钻攻机,加工中心</p>
        </li>
        <li>
          <p class="changjiap">机床厂家推荐</p>
          <a class="changjiaa" href="#">东莞市巨人机械有限公司</a>
          <p class="changjiap1"><span>主营：</span>精雕机,钻攻机,加工中心</p>
        </li>
        <li>
          <p class="changjiap">机床厂家推荐</p>
          <a class="changjiaa" href="#">东莞市巨人机械有限公司</a>
          <p class="changjiap1"><span>主营：</span>精雕机,钻攻机,加工中心</p>
        </li>
        <li>
          <p class="changjiap">机床厂家推荐</p>
          <a class="changjiaa" href="#">东莞市巨人机械有限公司</a>
          <p class="changjiap1"><span>主营：</span>精雕机,钻攻机,加工中心</p>
        </li>
      </ul>
    </div>
  </div>

  <!-- 品牌推荐 -->
  <div class="brandrecommand">
    <div class="brandrecommandcontent">
      <div class="inner">
        <h3>品牌推荐</h3>
        <ul class="brandrecommandlist">
          <li>
            <a href="#">
              <img src="images/pprecommand1.png" alt="">
            </a>
          </li>
          <li>
            <a href="#">
              <img src="images/pprecommand2.jpg" alt="">
            </a>
          </li>
          <li>
            <a href="#">
              <img src="images/pprecommand3.jpg" alt="">
            </a>
          </li>
          <li>
            <a href="#">
              <img src="images/pprecommand4.jpg" alt="">
            </a>
          </li>
          <li>
            <a href="#">
              <img src="images/pprecommand5.jpg" alt="">
            </a>
          </li>
          <li>
            <a href="#">
              <img src="images/pprecommand6.jpg" alt="">
            </a>
          </li>
          <li>
            <a href="#">
              <img src="images/pprecommand7.jpg" alt="">
            </a>
          </li>
          <li>
            <a href="#">
              <img src="images/pprecommand8.jpg" alt="">
            </a>
          </li>
          <li>
            <a href="#">
              <img src="images/pprecommand9.png" alt="">
            </a>
          </li>
          <li>
            <a href="#">
              <img src="images/pprecommand10.jpg" alt="">
            </a>
          </li>
          <li>
            <a href="#">
              <img src="images/pprecommand11.jpg" alt="">
            </a>
          </li>
          <li>
            <a href="#">
              <img src="images/pprecommand12.jpg" alt="">
            </a>
          </li>
        </ul>
      </div>
    </div>
  </div>

  <!-- 楼层布局 -->
  <div class="floor">
    <div class="floorlayout">
      <div class="flooraside">
        <h3>工业品</h3>
        <p>
          INDUSTRIAL PRODUCTS
        </p>
        <div class="floorasideimg">
          <div class="img">
            <img src="images/floorasideimg1.jpg" alt="">
            <div class="floortext">
              工具内窥镜
            </div>
          </div>
          <ul class="floorcircle">
            <li></li>
            <li></li>
            <li></li>
          </ul>
        </div>
        
      </div>
      <div class="floorproduct">
        <ul class="producttop">
          <li>机械及行业设备</li>
          <li>仪器仪表</li>
          <li>照明工业</li>
          <li>安全防护</li>
          <li>电工电气</li>
          <div class="more">>>></div>
        </ul>
        <div class="productlist">
          <div class="item">
            <img src="images/productitem1.jpg" alt="">
            <p>风电备件东汽、华锐</p>
            <span>￥ 1.00</span>
          </div>
          <div class="item">
            <img src="images/productitem1.jpg" alt="">
            <p>风电备件东汽、华锐</p>
            <span>￥ 100.00</span>
          </div>
          <div class="item">
            <img src="images/productitem1.jpg" alt="">
            <p>风电备件东汽、华锐</p>
            <span>￥ 100.00</span>
          </div>
          <div class="item">
            <img src="images/productitem1.jpg" alt="">
            <p>风电备件东汽、华锐</p>
            <span>￥ 100.00</span>
          </div>
          <div class="item">
            <img src="images/productitem1.jpg" alt="">
            <p>风电备件东汽、华锐</p>
            <span>￥ 100.00</span>
          </div>
          <div class="item">
            <img src="images/productitem1.jpg" alt="">
            <p>风电备件东汽、华锐</p>
            <span>￥ 100.00</span>
          </div>
        </div>
      </div>
      <div class="floorright">
        <div class="righttop">诚信商家</div>
        <div class="companyitem1">
          <p>深圳市和西智能装备股份有限公司</p>
          <p>经营范围：经营范围：回流焊,波峰焊,插件机,AOI,印刷机,立式插件机,卧式插件机,在线插件机,卧式联体插件机,离线AOI,在线AOI光学检测仪,波峰焊机,无铅回流焊机,无铅波峰焊机,上板机,顺序编排机,立式固化炉</p>
        </div>
        <div class="companyitem1">
          <p>深圳市和西智能装备股份有限公司</p>
          <p>经营范围：经营范围：回流焊,波峰焊,插件机,AOI,印刷机,立式插件机,卧式插件机,在线插件机,卧式联体插件机,离线AOI,在线AOI光学检测仪,波峰焊机,无铅回流焊机,无铅波峰焊机,上板机,顺序编排机,立式固化炉</p>
        </div>
        <div class="companyitem1">
          <p>深圳市和西智能装备股份有限公司</p>
          <p>经营范围：经营范围：回流焊,波峰焊,插件机,AOI,印刷机,立式插件机,卧式插件机,在线插件机,卧式联体插件机,离线AOI,在线AOI光学检测仪,波峰焊机,无铅回流焊机,无铅波峰焊机,上板机,顺序编排机,立式固化炉</p>
        </div>
        <div class="companyitem1">
          <p>深圳市和西智能装备股份有限公司</p>
          <p>经营范围：经营范围：回流焊,波峰焊,插件机,AOI,印刷机,立式插件机,卧式插件机,在线插件机,卧式联体插件机,离线AOI,在线AOI光学检测仪,波峰焊机,无铅回流焊机,无铅波峰焊机,上板机,顺序编排机,立式固化炉</p>
        </div>
        <div class="companyitem1">
          <p>深圳市和西智能装备股份有限公司</p>
          <p>经营范围：经营范围：回流焊,波峰焊,插件机,AOI,印刷机,立式插件机,卧式插件机,在线插件机,卧式联体插件机,离线AOI,在线AOI光学检测仪,波峰焊机,无铅回流焊机,无铅波峰焊机,上板机,顺序编排机,立式固化炉</p>
        </div>
      </div>
    </div>
  </div>
  <div class="banner">
    <img src="images/banner1.jpg" alt="">
  </div>

  <div class="floor">
    <div class="floorlayout">
      <div class="flooraside">
        <h3>工业品</h3>
        <p>
          INDUSTRIAL PRODUCTS
        </p>
        <div class="floorasideimg">
          <div class="img">
            <img src="images/floorasideimg1.jpg" alt="">
            <div class="floortext">
              工具内窥镜
            </div>
          </div>
          <ul class="floorcircle">
            <li></li>
            <li></li>
            <li></li>
          </ul>
        </div>
        
      </div>
      <div class="floorproduct">
        <ul class="producttop">
          <li>机械及行业设备</li>
          <li>仪器仪表</li>
          <li>照明工业</li>
          <li>安全防护</li>
          <li>电工电气</li>
          <div class="more">>>></div>
        </ul>
        <div class="productlist">
          <div class="item">
            <img src="images/productitem1.jpg" alt="">
            <p>风电备件东汽、华锐</p>
            <span>￥ 1.00</span>
          </div>
          <div class="item">
            <img src="images/productitem1.jpg" alt="">
            <p>风电备件东汽、华锐</p>
            <span>￥ 100.00</span>
          </div>
          <div class="item">
            <img src="images/productitem1.jpg" alt="">
            <p>风电备件东汽、华锐</p>
            <span>￥ 100.00</span>
          </div>
          <div class="item">
            <img src="images/productitem1.jpg" alt="">
            <p>风电备件东汽、华锐</p>
            <span>￥ 100.00</span>
          </div>
          <div class="item">
            <img src="images/productitem1.jpg" alt="">
            <p>风电备件东汽、华锐</p>
            <span>￥ 100.00</span>
          </div>
          <div class="item">
            <img src="images/productitem1.jpg" alt="">
            <p>风电备件东汽、华锐</p>
            <span>￥ 100.00</span>
          </div>
        </div>
      </div>
      <div class="floorright">
        <div class="righttop">诚信商家</div>
        <div class="companyitem1">
          <p>深圳市和西智能装备股份有限公司</p>
          <p>经营范围：经营范围：回流焊,波峰焊,插件机,AOI,印刷机,立式插件机,卧式插件机,在线插件机,卧式联体插件机,离线AOI,在线AOI光学检测仪,波峰焊机,无铅回流焊机,无铅波峰焊机,上板机,顺序编排机,立式固化炉</p>
        </div>
        <div class="companyitem1">
          <p>深圳市和西智能装备股份有限公司</p>
          <p>经营范围：经营范围：回流焊,波峰焊,插件机,AOI,印刷机,立式插件机,卧式插件机,在线插件机,卧式联体插件机,离线AOI,在线AOI光学检测仪,波峰焊机,无铅回流焊机,无铅波峰焊机,上板机,顺序编排机,立式固化炉</p>
        </div>
        <div class="companyitem1">
          <p>深圳市和西智能装备股份有限公司</p>
          <p>经营范围：经营范围：回流焊,波峰焊,插件机,AOI,印刷机,立式插件机,卧式插件机,在线插件机,卧式联体插件机,离线AOI,在线AOI光学检测仪,波峰焊机,无铅回流焊机,无铅波峰焊机,上板机,顺序编排机,立式固化炉</p>
        </div>
        <div class="companyitem1">
          <p>深圳市和西智能装备股份有限公司</p>
          <p>经营范围：经营范围：回流焊,波峰焊,插件机,AOI,印刷机,立式插件机,卧式插件机,在线插件机,卧式联体插件机,离线AOI,在线AOI光学检测仪,波峰焊机,无铅回流焊机,无铅波峰焊机,上板机,顺序编排机,立式固化炉</p>
        </div>
        <div class="companyitem1">
          <p>深圳市和西智能装备股份有限公司</p>
          <p>经营范围：经营范围：回流焊,波峰焊,插件机,AOI,印刷机,立式插件机,卧式插件机,在线插件机,卧式联体插件机,离线AOI,在线AOI光学检测仪,波峰焊机,无铅回流焊机,无铅波峰焊机,上板机,顺序编排机,立式固化炉</p>
        </div>
      </div>
    </div>
  </div>
  <div class="banner">
    <img src="images/banner1.jpg" alt="">
  </div>

  <div class="floor">
    <div class="floorlayout">
      <div class="flooraside">
        <h3>工业品</h3>
        <p>
          INDUSTRIAL PRODUCTS
        </p>
        <div class="floorasideimg">
          <div class="img">
            <img src="images/floorasideimg1.jpg" alt="">
            <div class="floortext">
              工具内窥镜
            </div>
          </div>
          <ul class="floorcircle">
            <li></li>
            <li></li>
            <li></li>
          </ul>
        </div>
        
      </div>
      <div class="floorproduct">
        <ul class="producttop">
          <li>机械及行业设备</li>
          <li>仪器仪表</li>
          <li>照明工业</li>
          <li>安全防护</li>
          <li>电工电气</li>
          <div class="more">>>></div>
        </ul>
        <div class="productlist">
          <div class="item">
            <img src="images/productitem1.jpg" alt="">
            <p>风电备件东汽、华锐</p>
            <span>￥ 1.00</span>
          </div>
          <div class="item">
            <img src="images/productitem1.jpg" alt="">
            <p>风电备件东汽、华锐</p>
            <span>￥ 100.00</span>
          </div>
          <div class="item">
            <img src="images/productitem1.jpg" alt="">
            <p>风电备件东汽、华锐</p>
            <span>￥ 100.00</span>
          </div>
          <div class="item">
            <img src="images/productitem1.jpg" alt="">
            <p>风电备件东汽、华锐</p>
            <span>￥ 100.00</span>
          </div>
          <div class="item">
            <img src="images/productitem1.jpg" alt="">
            <p>风电备件东汽、华锐</p>
            <span>￥ 100.00</span>
          </div>
          <div class="item">
            <img src="images/productitem1.jpg" alt="">
            <p>风电备件东汽、华锐</p>
            <span>￥ 100.00</span>
          </div>
        </div>
      </div>
      <div class="floorright">
        <div class="righttop">诚信商家</div>
        <div class="companyitem1">
          <p>深圳市和西智能装备股份有限公司</p>
          <p>经营范围：经营范围：回流焊,波峰焊,插件机,AOI,印刷机,立式插件机,卧式插件机,在线插件机,卧式联体插件机,离线AOI,在线AOI光学检测仪,波峰焊机,无铅回流焊机,无铅波峰焊机,上板机,顺序编排机,立式固化炉</p>
        </div>
        <div class="companyitem1">
          <p>深圳市和西智能装备股份有限公司</p>
          <p>经营范围：经营范围：回流焊,波峰焊,插件机,AOI,印刷机,立式插件机,卧式插件机,在线插件机,卧式联体插件机,离线AOI,在线AOI光学检测仪,波峰焊机,无铅回流焊机,无铅波峰焊机,上板机,顺序编排机,立式固化炉</p>
        </div>
        <div class="companyitem1">
          <p>深圳市和西智能装备股份有限公司</p>
          <p>经营范围：经营范围：回流焊,波峰焊,插件机,AOI,印刷机,立式插件机,卧式插件机,在线插件机,卧式联体插件机,离线AOI,在线AOI光学检测仪,波峰焊机,无铅回流焊机,无铅波峰焊机,上板机,顺序编排机,立式固化炉</p>
        </div>
        <div class="companyitem1">
          <p>深圳市和西智能装备股份有限公司</p>
          <p>经营范围：经营范围：回流焊,波峰焊,插件机,AOI,印刷机,立式插件机,卧式插件机,在线插件机,卧式联体插件机,离线AOI,在线AOI光学检测仪,波峰焊机,无铅回流焊机,无铅波峰焊机,上板机,顺序编排机,立式固化炉</p>
        </div>
        <div class="companyitem1">
          <p>深圳市和西智能装备股份有限公司</p>
          <p>经营范围：经营范围：回流焊,波峰焊,插件机,AOI,印刷机,立式插件机,卧式插件机,在线插件机,卧式联体插件机,离线AOI,在线AOI光学检测仪,波峰焊机,无铅回流焊机,无铅波峰焊机,上板机,顺序编排机,立式固化炉</p>
        </div>
      </div>
    </div>
  </div>
  <div class="banner">
    <img src="images/banner1.jpg" alt="">
  </div>

  <div class="floor">
    <div class="floorlayout">
      <div class="flooraside">
        <h3>工业品</h3>
        <p>
          INDUSTRIAL PRODUCTS
        </p>
        <div class="floorasideimg">
          <div class="img">
            <img src="images/floorasideimg1.jpg" alt="">
            <div class="floortext">
              工具内窥镜
            </div>
          </div>
          <ul class="floorcircle">
            <li></li>
            <li></li>
            <li></li>
          </ul>
        </div>
        
      </div>
      <div class="floorproduct">
        <ul class="producttop">
          <li>机械及行业设备</li>
          <li>仪器仪表</li>
          <li>照明工业</li>
          <li>安全防护</li>
          <li>电工电气</li>
          <div class="more">>>></div>
        </ul>
        <div class="productlist">
          <div class="item">
            <img src="images/productitem1.jpg" alt="">
            <p>风电备件东汽、华锐</p>
            <span>￥ 1.00</span>
          </div>
          <div class="item">
            <img src="images/productitem1.jpg" alt="">
            <p>风电备件东汽、华锐</p>
            <span>￥ 100.00</span>
          </div>
          <div class="item">
            <img src="images/productitem1.jpg" alt="">
            <p>风电备件东汽、华锐</p>
            <span>￥ 100.00</span>
          </div>
          <div class="item">
            <img src="images/productitem1.jpg" alt="">
            <p>风电备件东汽、华锐</p>
            <span>￥ 100.00</span>
          </div>
          <div class="item">
            <img src="images/productitem1.jpg" alt="">
            <p>风电备件东汽、华锐</p>
            <span>￥ 100.00</span>
          </div>
          <div class="item">
            <img src="images/productitem1.jpg" alt="">
            <p>风电备件东汽、华锐</p>
            <span>￥ 100.00</span>
          </div>
        </div>
      </div>
      <div class="floorright">
        <div class="righttop">诚信商家</div>
        <div class="companyitem1">
          <p>深圳市和西智能装备股份有限公司</p>
          <p>经营范围：经营范围：回流焊,波峰焊,插件机,AOI,印刷机,立式插件机,卧式插件机,在线插件机,卧式联体插件机,离线AOI,在线AOI光学检测仪,波峰焊机,无铅回流焊机,无铅波峰焊机,上板机,顺序编排机,立式固化炉</p>
        </div>
        <div class="companyitem1">
          <p>深圳市和西智能装备股份有限公司</p>
          <p>经营范围：经营范围：回流焊,波峰焊,插件机,AOI,印刷机,立式插件机,卧式插件机,在线插件机,卧式联体插件机,离线AOI,在线AOI光学检测仪,波峰焊机,无铅回流焊机,无铅波峰焊机,上板机,顺序编排机,立式固化炉</p>
        </div>
        <div class="companyitem1">
          <p>深圳市和西智能装备股份有限公司</p>
          <p>经营范围：经营范围：回流焊,波峰焊,插件机,AOI,印刷机,立式插件机,卧式插件机,在线插件机,卧式联体插件机,离线AOI,在线AOI光学检测仪,波峰焊机,无铅回流焊机,无铅波峰焊机,上板机,顺序编排机,立式固化炉</p>
        </div>
        <div class="companyitem1">
          <p>深圳市和西智能装备股份有限公司</p>
          <p>经营范围：经营范围：回流焊,波峰焊,插件机,AOI,印刷机,立式插件机,卧式插件机,在线插件机,卧式联体插件机,离线AOI,在线AOI光学检测仪,波峰焊机,无铅回流焊机,无铅波峰焊机,上板机,顺序编排机,立式固化炉</p>
        </div>
        <div class="companyitem1">
          <p>深圳市和西智能装备股份有限公司</p>
          <p>经营范围：经营范围：回流焊,波峰焊,插件机,AOI,印刷机,立式插件机,卧式插件机,在线插件机,卧式联体插件机,离线AOI,在线AOI光学检测仪,波峰焊机,无铅回流焊机,无铅波峰焊机,上板机,顺序编排机,立式固化炉</p>
        </div>
      </div>
    </div>
  </div>
  <div class="banner">
    <img src="images/banner1.jpg" alt="">
  </div>

  <div class="floor">
    <div class="floorlayout">
      <div class="flooraside">
        <h3>工业品</h3>
        <p>
          INDUSTRIAL PRODUCTS
        </p>
        <div class="floorasideimg">
          <div class="img">
            <img src="images/floorasideimg1.jpg" alt="">
            <div class="floortext">
              工具内窥镜
            </div>
          </div>
          <ul class="floorcircle">
            <li></li>
            <li></li>
            <li></li>
          </ul>
        </div>
        
      </div>
      <div class="floorproduct">
        <ul class="producttop">
          <li>机械及行业设备</li>
          <li>仪器仪表</li>
          <li>照明工业</li>
          <li>安全防护</li>
          <li>电工电气</li>
          <div class="more">>>></div>
        </ul>
        <div class="productlist">
          <div class="item">
            <img src="images/productitem1.jpg" alt="">
            <p>风电备件东汽、华锐</p>
            <span>￥ 1.00</span>
          </div>
          <div class="item">
            <img src="images/productitem1.jpg" alt="">
            <p>风电备件东汽、华锐</p>
            <span>￥ 100.00</span>
          </div>
          <div class="item">
            <img src="images/productitem1.jpg" alt="">
            <p>风电备件东汽、华锐</p>
            <span>￥ 100.00</span>
          </div>
          <div class="item">
            <img src="images/productitem1.jpg" alt="">
            <p>风电备件东汽、华锐</p>
            <span>￥ 100.00</span>
          </div>
          <div class="item">
            <img src="images/productitem1.jpg" alt="">
            <p>风电备件东汽、华锐</p>
            <span>￥ 100.00</span>
          </div>
          <div class="item">
            <img src="images/productitem1.jpg" alt="">
            <p>风电备件东汽、华锐</p>
            <span>￥ 100.00</span>
          </div>
        </div>
      </div>
      <div class="floorright">
        <div class="righttop">诚信商家</div>
        <div class="companyitem1">
          <p>深圳市和西智能装备股份有限公司</p>
          <p>经营范围：经营范围：回流焊,波峰焊,插件机,AOI,印刷机,立式插件机,卧式插件机,在线插件机,卧式联体插件机,离线AOI,在线AOI光学检测仪,波峰焊机,无铅回流焊机,无铅波峰焊机,上板机,顺序编排机,立式固化炉</p>
        </div>
        <div class="companyitem1">
          <p>深圳市和西智能装备股份有限公司</p>
          <p>经营范围：经营范围：回流焊,波峰焊,插件机,AOI,印刷机,立式插件机,卧式插件机,在线插件机,卧式联体插件机,离线AOI,在线AOI光学检测仪,波峰焊机,无铅回流焊机,无铅波峰焊机,上板机,顺序编排机,立式固化炉</p>
        </div>
        <div class="companyitem1">
          <p>深圳市和西智能装备股份有限公司</p>
          <p>经营范围：经营范围：回流焊,波峰焊,插件机,AOI,印刷机,立式插件机,卧式插件机,在线插件机,卧式联体插件机,离线AOI,在线AOI光学检测仪,波峰焊机,无铅回流焊机,无铅波峰焊机,上板机,顺序编排机,立式固化炉</p>
        </div>
        <div class="companyitem1">
          <p>深圳市和西智能装备股份有限公司</p>
          <p>经营范围：经营范围：回流焊,波峰焊,插件机,AOI,印刷机,立式插件机,卧式插件机,在线插件机,卧式联体插件机,离线AOI,在线AOI光学检测仪,波峰焊机,无铅回流焊机,无铅波峰焊机,上板机,顺序编排机,立式固化炉</p>
        </div>
        <div class="companyitem1">
          <p>深圳市和西智能装备股份有限公司</p>
          <p>经营范围：经营范围：回流焊,波峰焊,插件机,AOI,印刷机,立式插件机,卧式插件机,在线插件机,卧式联体插件机,离线AOI,在线AOI光学检测仪,波峰焊机,无铅回流焊机,无铅波峰焊机,上板机,顺序编排机,立式固化炉</p>
        </div>
      </div>
    </div>
  </div>
  
  <!-- 底部的广告 -->
  <div class="fixbanner">
    <img src="images/fixbanner.png" alt="">
  </div>


  <script>
     var fixbanner = document.querySelector('.fixbanner')
     document.addEventListener('scroll',function(e){
      //  console.log(document.documentElement.scrollTop);
      //  console.log(window.pageYOffset);
       window.pageYOffset>1000?fixbanner.style.display = 'none':fixbanner.style.display = 'block';
      //  if(window.pageYOffset>1000){
      //   fixbanner.style.display = 'none'
      //  }
      //  else{
      //   fixbanner.style.display = 'block'
      //  }
     })
  </script>
</body>

</html>